<%@page import="com.lukebang.constant.Const"%>
<%@page import="com.lukebang.pojo.Merchant"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page import="com.lukebang.util.RSAUtils"%>
<%@ page import="java.util.HashMap"%>
<%@ page import="java.util.Map"%>
<%@ page import="java.security.interfaces.*"%>
<c:set var="ctxPath" value="${pageContext.request.contextPath}"
	scope="application"/>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="description" content="">
<meta name="author" content="ThemeBucket">
<link rel="shortcut icon" type="../image/png">
<title>我的明细</title>
<link rel="stylesheet"
	href="${ctxPath}/static/js/data-tables/DT_bootstrap.css" />
<link rel="stylesheet" type="text/css"
	href="${ctxPath}/static/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" />
<link href="${ctxPath}/static/css/style.css" rel="stylesheet">
<link href="${ctxPath}/static/css/style-responsive.css" rel="stylesheet">
<link rel="shortcut icon" type="image/x-icon"
	href="${ctxPath }/static/images/lukebang320.ico" media="screen" />
<link rel="icon" href="${ctxPath }/static/images/lukebang320.ico"
	type="image/x-icon" />
<link rel="bookmark" href="${ctxPath }/static/images/lukebang320.ico"
	type="image/x-icon" />
<%
	HashMap<String, Object> map = RSAUtils.getKeys();
	//生成公钥和私钥    
	RSAPublicKey publicKey = (RSAPublicKey) map.get("public");
	RSAPrivateKey privateKey = (RSAPrivateKey) map.get("private");
	session.setAttribute("privateKey", privateKey);//私钥保存在session中，用于解密  
	//公钥信息保存在页面，用于加密  
	String publicKeyExponent = publicKey.getPublicExponent().toString(16); //公钥指数   
	String publicKeyModulus = publicKey.getModulus().toString(16); //模    
	request.setAttribute("publicKeyExponent", publicKeyExponent);
	request.setAttribute("publicKeyModulus", publicKeyModulus);
%>
</head>
<body class="sticky-header" onload="indexmenu('${oneMenu}','${twoMenu}')">
	<%@ include file="../index/index.jsp"%>
	<div class="main-content" style="overflow-y: auto">
		<!-- 地址栏-->
		<div class="page-heading">
			<h3>鹿客帮下单版</h3>
			<ul class="breadcrumb">
				<li><a>我的钱包</a></li>
				<li class="active">我的明细</li>
			</ul>
		</div>
		<!--这里是写一些内容的  -->
		<section class="panel">
			<header class="panel-heading custom-tab turquoise-tab">
				<ul class="nav nav-tabs">
					<li class=""><a onclick="clickOrders(1,'details')">交易记录</a></li>
				</ul>
			</header>
			<div class="panel-body">
				<div class="panel panel-default" style="border-bottom-width: 0px">
					<div class="panel-heading">查询条件</div>
					<form id="queryConditionForm">
						<table
							class="table table-striped table-bordered table-hover table-checkable"
							style="border-width: 0" id="datatable_ajax">
							<thead>
								<tr role="row" class="heading">
									<th align="center" width="6%">订单ID</th>
									<th align="center" width="10%">选择</th>
									<th align="center" width="10%">选择</th>
									<th align="center" width="7%">操作</th>
								</tr>
								<tr role="row" class="filter">
									<td><input type="text"
										class="form-control form-filter input-sm" name="indentID">
										<input type="hidden" id="" value="" name="merchantsId"/>
									</td>
									<td>
										<div class="input-group date form_datetime"
											style="margin-bottom: 5px" data-link-field="">
											<input class="form-control" size="10" type="text" value=""
												name="recordBeginTime" placeholder="起始时间" readonly>		
											<span class="input-group-addon"><span
												class="glyphicon glyphicon-remove"></span></span> <span
												class="input-group-addon"><span
												class="glyphicon glyphicon-calendar"></span></span>
										</div> <input type="hidden" id="" value="" name=""/>
									</td>
									<td><div class="input-group date form_datetime"
											style="margin-bottom: 5px">
											<input class="form-control" size="16" type="text" value=""
												name="recordEndTime" placeholder="结束时间" readonly> <span
												class="input-group-addon"><span
												class="glyphicon glyphicon-remove"></span></span> <span
												class="input-group-addon"><span
												class="glyphicon glyphicon-calendar"></span></span>
										</div> <input type="hidden" id="dtp_input1" value="" />
								    </td>
									<td>
										<div style="margin-bottom: 5px">
											<button style="width: 70px" id="button_refreshQuery"
												type="button"
												class="btn btn-sm green btn-outline filter-submit margin-bottom">
												<i class="fa fa-search"></i> 查询
											</button>
											<button style="width: 70px" type="button"
											onclick="$('#queryConditionForm')[0].reset()"
											class="btn btn-sm red btn-outline filter-cancel">
											<i class="fa fa-times"></i> 重置
										</button>
										</div>
									</td>
								</tr>
							</thead>
						</table>
					</form>
				</div>
				<div class="tab-content">
					<div id="noPayOrders" class="tab-pane active">
						<table id="tb_details"></table>
					</div>
				</div>
			</div>
		</section>
	</div>
    <!-- 交易信息 -->
	<jsp:include page="viewMerchantsRecordInfo.jsp"></jsp:include>
</body>
<!--pickers initialization-->
<script type="text/javascript">
   $(document).ready(function(){
	 $("select#walletOpt").val(2);
   });
	var costRules = new Object;
	var indentPrice = new Number(0);
	var isNeedTakingGoods = new Number(0);
	var realIndentPrice = new Number(0);
	var TableInit = function() {
		var oTableInit = new Object();
		//初始化Table
		oTableInit.Init = function() {
			$('#tb_details')
					.bootstrapTable(
							{
								url : '${ctxPath}/merchant/queryMerchantWalletRecord', //请求后台的URL（*）
								method : 'post', //请求方式（*）
								toolbar : '#toolbar', //工具按钮用哪个容器
								striped : true, //是否显示行间隔色
								cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
								pagination : true, //是否显示分页（*）
								sortable : false, //是否启用排序
								sortName : 'recordBeginTime',
								sortOrder : "desc", //排序方式
								queryParams : oTableInit.queryParams,//传递参数（*）
								sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
								pageNumber : 1, //初始化加载第一页，默认第一页
								pageSize : 8, //每页的记录行数（*）
								pageList : [ 8, 25, 50, 100 ],
								search : false, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
								strictSearch : false,
								showColumns : false, //是否显示所有的列
								showRefresh : true, //是否显示刷新按钮
								minimumCountColumns : 2, //最少允许的列数
								clickToSelect : false, //是否启用点击选中行
								height : 600, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
								uniqueId : "merchantsWalletRecordId", //每一行的唯一标识，一般为主键列
								showToggle : true, //是否显示详细视图和列表视图的切换按钮
								cardView : false, //是否显示详细视图
								detailView : false, //是否显示父子表
								contentType : 'application/x-www-form-urlencoded; charset=UTF-8',
								columns : [	
									     {
										   field : 'merchantsWalletRecordId',
										   title : '交易ID',
										   width : '3%',
										   align : "center"
									     }, 	
									     {
										    field : 'indentId',
										    title : '订单ID',
										    width : '8%',
										    align : "center",										   
									     },
										  {
											field : 'recordBeginTime',
											title : '开始时间',
											width : '11%',
											align : "center"
										 },
										 {
											field : 'recordEndTime',
											title : '结束时间',
											width : '11%',
											align : "center"
										 },
										 {
											field : 'status',
											title : '交易状态',
											width : '7%',
											align : "center",
											formatter : function(value, row,
													index) {
												if (value == 1) {
													return '成功';
												} else {
													return "<font color='red'>失败</font>";
												}
											}},
										  {
											field : 'method',
											title : '支付方式',
											width : '10%',
											align : "center",
										  },
										 {
										    field : 'remark',
										    title : '交易备注',
										    width : '12%',
										    align : "center"									    
									     } ,
										{
											field : 'tag',
											title : '交易详细信息',
											width : '10%',
											align : "center",
											formatter : function(value, row,
													index) {												
												return "<button class='btn btn-success btn-xs' onclick='javascript:viewMerchantsRecordDetialModalOpen("
														+ row.merchantsWalletRecordId
														+ ")'>查看交易信息</button>";
											}
										},]
							}); 
		};

		//得到查询的参数
		oTableInit.queryParams = function(params) {
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				limit : params.limit, //页面大小
				offset : params.offset, //页码
				order : params.order,
				sort : params.sort,
				indentId : $("input[name='indentID']").val(),
				recordBeginTime : $("input[name='recordBeginTime']")
						.val(),
				recordEndTime : $("input[name='recordEndTime']").val(),
			};
			return temp;
		};
		return oTableInit;
	};

	$(function() {
		//1.初始化Table
		var oTable = new TableInit();
		oTable.Init();
		$('.form_datetime').datetimepicker({
			language : 'zh-CN',
			format : "yyyy-mm-dd hh:ii:ss",
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			forceParse : 0,
			showMeridian : 1
		});
		$('.form_date').datetimepicker({
			//language : 'fr',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			minView : 2,
			forceParse : 0
		});
		$('.form_time').datetimepicker({
			//language : 'fr',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 1,
			minView : 0,
			maxView : 1,
			forceParse : 0
		});
		$("#button_refreshQuery").click(function() {
			var opt = {
				pageNumber : 1,
				query : {
					offset : 0
				}
			};
			//从新开始计数
			$("#tb_details").bootstrapTable('refresh', opt);
		});
	});
	
	//查看商户交易详细信息
	function viewMerchantsRecordDetialModalOpen(merchantsWalletRecordId) {
		clearModal();
		var viewRow = $('#tb_details').bootstrapTable('getRowByUniqueId',
				merchantsWalletRecordId);
		if(viewRow.finalGetMoney!=0){
			$("#viewMerchantsRecordDetail #txt_finalGetMoney").val(viewRow.finalGetMoney+"元");
		}
		if(viewRow.finalLostMoney!=0){
			$("#viewMerchantsRecordDetail #txt_finalLostMoney").val(viewRow.finalLostMoney+"元");
		}
		$("#txt_Time").val(viewRow.recordBeginTime);
		$("#viewMerchantsRecordDetail #txt_orderNo").val(viewRow.orderNo);
		$('#viewMerchantsRecordDetail').modal('show');		
	}
	function clearModal(){
		$("#viewMerchantsRecordDetail").modal('hide');
		$("#viewMerchantsRecordDetail #txt_finalGetMoney").val("");
		$("#viewMerchantsRecordDetail #txt_finalLostMoney").val("");
		$("#txt_Time").val("");			
		$("#viewMerchantsRecordDetail #txt_orderNo").val("");
	}
	
	//选中 明细
	$(document).ready(function(){
		$("select#walletOpt").val(2);
	})
</script>
<script src="${ctxPath}/static/js/security/security.js"></script>
<script type="text/javascript"
	src="${ctxPath}/static/js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript"
	src="${ctxPath}/static/js/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<!-- tables插件的引用 -->
<script src="${ctxPath}/static/js/bootstrap-table/bootstrap-table.js"></script>
<link href="${ctxPath}/static/js/bootstrap-table/bootstrap-table.css"
	rel="stylesheet" />
<script
	src="${ctxPath}/static/js/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
<script src="${ctxPath }/static/js/pickers-init.js"></script>
<script src="${ctxPath }/static/js/bootstrap-touchspin/bootstrap.touchspin.min.js"
	type="text/javascript"></script>
<script src="${ctxPath}/static/js/jquery.validate.min.js"></script>
<script src="${ctxPath}/static/js/jquery.stepy.js"></script>
<script src="${ctxPath}/static/js/jquery.nicescroll.js"></script>
<script src="${ctxPath}/static/js/jquery-ui-1.9.2.custom.min.js"></script>

</html>
